<!DOCTYPE html>
<html>
	<head>
		<title>成人/儿童疫苗预约</title>
		<meta charset="utf-8">
		<meta http-equiv="X-UA-Compatible" content="IE=edge">
		<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no">
		<link rel="stylesheet" href="${s.base}/mobile/newcss/weui.min.css">
		<link rel="stylesheet" href="${s.base}/mobile/newcss/jquery-weui.css">
		<link rel="stylesheet" href="${s.base}/mobile/newcss/base.css?123456">
		<link rel="stylesheet" type="text/css" href="${s.base}/mobile/css/city.css"/>
		<link rel="stylesheet" type="text/css" href="${s.base}/mobile/js/DateSelector/DateSelector.css?rev=@@hash"/>
	</head>


	<style type="text/css">
		html,body{background:#ffffff;}
		.icon{width: 1rem; height: 1rem;}
		.radiow{width: 0.8rem; height: 0.8rem; margin: 0.3rem 0.1rem;}
		.xyg-comp-list-select{width:96%; margin: 0.2rem 2%; border-radius: 0.5rem; height:auto;}
		.xyg-comp-list-select-desc{width:100%;text-align:center;color:#ffffff; letter-spacing: 0.01rem; border-radius: 0.2rem 0.2rem 0px 0px; background: #069AFE;border-right: 0.001rem solid #f5f5f5;border-left: 0.001rem solid #f5f5f5;}
		.xyg-comp-list-select-item{width:94%; padding:0px 3%;  color:#333333; letter-spacing: 0.01rem;}
		.xyg-comp-list-select-item input::-webkit-input-placeholder {color: #999999;}
		.xyg-comp-list-select-item .xyg-comp-list-select-item-title{width:25%; font-size: 16px; line-height: 2rem; letter-spacing: 1px; color:#8c8c8c; height:2rem; text-align:left; float:left;}
		.xyg-comp-list-select-item .xyg-comp-list-select-item-content{width:75%;font-size: 16px; height:2rem;line-height: 2rem; letter-spacing: 1px; color:#8c8c8c; text-align:left; float:left;}
		.xyg-comp-list-select-item .xyg-comp-list-select-item-content input[type='text']{width:90%; margin-right: 10%; font-size: 14px; height:1.8rem; line-height:1.8rem;background-color:transparent;border:0; text-align:right;}
		.xyg-comp-list-select-item .xyg-comp-list-select-item-content input[class='inputicon']{width:80%; margin-right: 3%; }
		.xyg-comp-list-select-item-lineTitle{width:100%; font-size: 16px; letter-spacing: 1px; color:#8c8c8c; padding: 0.2rem 0px; text-align:left;}
		.xyg-comp-list-select-item-lineContent input[type='text']{width:96%; font-size: 16px; height:2rem; line-height:2rem; padding: 0px 2%; background-color:#ffffff;border:1px solid #e3e3e3; border-radius: 0.2rem;}
		.xyg-comp-list-select-item-lineContent{padding-bottom: 0.3rem; position: relative;}
		.xyg-comp-list-select-item-lineContent .iconContent{padding-bottom: 0.3rem; position: absolute; right:0.6rem; top: 0.7rem;}
		.xyg-comp-list-select-textarea{width:90%;  color:#333333;padding:0px 5%;height:13.2rem;font-size: 0.8rem;  letter-spacing: 0.01rem; background: #FFF; border: 0.001rem solid #f5f5f5;}
		.xyg-comp-list-select-textarea .xyg-comp-list-select-textarea-title{width:100%; line-height: 2rem; height:2rem; text-align:left;}
		.xyg-comp-list-select-textarea .xyg-comp-list-select-textarea-content{width:100%; height:4rem; text-align:left; float:left;}
		.xyg-comp-list-select-textarea .xyg-comp-list-select-textarea-content textarea{width:92%; padding: 0.2rem 4%; height:9.6rem; margin-bottom: 1rem; line-height:1rem;background-color:#E5E5E5;;border:0; text-align:left;}

		.xyg-comp-xy{height:2rem; line-height:2rem;width:93%; margin:0px 2% 0px 5%;}
		.xyg-bottom{width:90%; height:auto;  margin:1.5rem 5%;}
		.xyg-bottom  .xyg-btn{
			position: relative;
			background: #dddddd;
			border: 1px solid #e3e3e3;
			display: block;
			margin-left: auto;
			margin-right: auto;
			padding-left: 14px;
			padding-right: 14px;
			box-sizing: border-box;
			font-size: 18px;
			text-align: center;
			text-decoration: none;
			color: #8e8e8e;
			line-height: 2.55555556;
			border-radius: 5px;
			-webkit-tap-highlight-color: rgba(0,0,0,0);
			overflow: hidden;
		}
	</style>
	<body>
	<div id="showContent">
		<div class="xyg-comp-list-select">
			<div class="xyg-comp-list-select-item">
				<input type="hidden" id="id" value="${webSub.id}"/>
				<div class="xyg-comp-list-select-item-title">
					<span style="color:#ff3b30;"></span>客户类型:
				</div>
				<div class="xyg-comp-list-select-item-content">
					<input type="radio"  value="1" class="radiow"  id="person" name="type"  <#if webSub.type!='2'>checked</#if> /><label for="person">新客户</label>
					&nbsp;<input type="radio" class="radiow"  value="2" id="company"  name="type" <#if webSub.type=='2'>checked</#if>/><label for="company">已登记客户</label>
				</div>
				<div class="clearBoth"></div>
			</div>
			<div class="xyg-comp-list-select-item  xyg-class-select" <#if webSub.type=='2'> style="display: none;"</#if>>
				<div class="xyg-comp-list-select-item-lineTitle">
					<span style="color:#ff3b30;"></span>系统编号
				</div>
				<div class="xyg-comp-list-select-item-lineContent">
					<input type="text" id="sysUserNo" value="${webSub.sysUserNo}" placeholder="仅适用于内部人员填写" />
				</div>
			</div>
			<div class="xyg-comp-list-select-item xyg-class-select-o" <#if webSub.type!='2'> style="display: none;"</#if>>
				<div class="xyg-comp-list-select-item-lineTitle">
					<span style="color:#ff3b30;"></span>客户编号:
				</div>
				<div class="xyg-comp-list-select-item-lineContent">
					<input type="text" id="num" value="${webSub.num}" placeholder="请输入客户编号(HM00XXXX)"  />
				</div>
			</div>
			<div class="xyg-comp-list-select-item">
				<div class="xyg-comp-list-select-item-lineTitle">
					<span style="color:#ff3b30;"></span>服务
				</div>
				<div class="xyg-comp-list-select-item-lineContent">
					<input type="text" id="colId" value="${webSub.colId}" placeholder="请选择服务"/>
					<div class="iconContent">
						<svg class="icon" aria-hidden="true"><use xlink:href="#icon-xiangxia"></use></svg>
					</div>
				</div>
			</div>
			<div class="xyg-comp-list-select-item xyg-class-select-o" <#if webSub.type!='2'> style="display: none;"</#if>>
				<div class="xyg-comp-list-select-item-lineTitle"  >
					<span style="color:#ff3b30;"></span>针数
				</div>
				<div class="xyg-comp-list-select-item-lineContent">
					<input type="text" id="pinNum" value="${webSub.pinNum}" placeholder="请输入针数" />
					<div class="iconContent">
						<svg class="icon" aria-hidden="true"><use xlink:href="#icon-xiangxia"></use></svg>
					</div>
				</div>
			</div>
			<div class="xyg-comp-list-select-item">
				<div class="xyg-comp-list-select-item-lineTitle">
					<span style="color:#ff3b30;"></span>姓名
				</div>
				<div class="xyg-comp-list-select-item-lineContent">
					<input type="text" id="name" value="${webSub.name}" placeholder="请输入姓名" />
				</div>
			</div>
			<div class="xyg-comp-list-select-item xyg-class-select">
				<div class="xyg-comp-list-select-item-title">
					<span style="color:#ff3b30;"></span>客户性别:
				</div>
				<div class="xyg-comp-list-select-item-content">
					<input type="radio"  value="1" class="radiow"  id="n" name="sex"  <#if webSub.sex!='2'>checked</#if> /><label for="n">男</label>
					&nbsp;
					<input type="radio" class="radiow"  value="2" id="v" name="sex" <#if webSub.sex=='2'>checked</#if>/><label for="v">女</label>
				</div>
				<div class="clearBoth"></div>
			</div>
			<div class="xyg-comp-list-select-item  xyg-class-select" <#if webSub.type=='2'> style="display: none;"</#if>>
				<div class="xyg-comp-list-select-item-lineTitle">
					<span style="color:#ff3b30;"></span>身份证号
				</div>
				<div class="xyg-comp-list-select-item-lineContent">
					<input type="text" id="cardNo" value="${webSub.cardNo}" placeholder="请输入身份证号" />
				</div>
			</div>
			<div class="xyg-comp-list-select-item">
				<div class="xyg-comp-list-select-item-lineTitle">
					<span style="color:#ff3b30;"></span>联系电话
				</div>
				<div class="xyg-comp-list-select-item-lineContent">
					<input type="text" id="phone" value="${webSub.phone}" placeholder="请输入联系电话" />
				</div>
			</div>
			<div class="xyg-comp-list-select-item">
				<div class="xyg-comp-list-select-item-lineTitle">
					<span style="color:#ff3b30;"></span>日期
				</div>
				<div class="xyg-comp-list-select-item-lineContent">
					<input type="text" class="inputicon"  id="buyDate" value="${webSub.buyDate}" placeholder="请选输入日期" />
					<div class="iconContent">
						<svg class="icon" aria-hidden="true"><use xlink:href="#icon-xiangxia"></use></svg>
					</div>
				</div>
			</div>
			<div class="xyg-comp-list-select-item">
				<div class="xyg-comp-list-select-item-lineTitle">
					<span style="color:#ff3b30;"></span>时间
				</div>
				<div class="xyg-comp-list-select-item-lineContent">
					<input type="text" class="inputicon"  id="buyTime" value="${webSub.buyTime}" placeholder="请选输入时间" />
					<div class="iconContent">
						<svg class="icon" aria-hidden="true"><use xlink:href="#icon-xiangxia"></use></svg>
					</div>
				</div>
			</div>
			<div class="xyg-comp-list-select-item  xyg-class-select" <#if webSub.type=='2'> style="display: none;"</#if>>
				<div class="xyg-comp-list-select-item-lineTitle">
					<span style="color:#ff3b30;"></span>壹家人价格(港币)
				</div>
				<div class="xyg-comp-list-select-item-lineContent">
					<input type="text" id="adviseMoney" value="${webSub.adviseMoney}" placeholder="诊所/医院/体检中心到付费用" readonly/>
				</div>
			</div>
			<div class="xyg-comp-list-select-item  xyg-class-select" <#if webSub.type=='2'> style="display: none;"</#if>>
				<div class="xyg-comp-list-select-item-lineTitle">
					<span style="color:#ff3b30;"></span>预约服务金(人民币)
				</div>
				<div class="xyg-comp-list-select-item-lineContent">
					<input type="text" id="money" value="${webSub.money}" placeholder="此为本次预约服务收费，不设退款" />
				</div>
			</div>

		</div>
		<div class="xyg-bottom">
			<a href="javascript:;" class="xyg-btn" id="showTooltips" >提交</a>
		</div>
	</div>
	<div id="targetContainers"></div>
	</body>
	<script src="https://res.wx.qq.com/open/js/jweixin-1.3.2.js"></script>
	<script src="${s.base}/mobile/newjs/jquery-2.1.4.js?12132"></script>
	<script src="${s.base}/mobile/newjs/jquery-weui.js?12132"></script>
	<script src="${s.base}/mobile/fonts/iconfont.js?121322323"></script>
	<script src="${s.base}/mobile/js/base.js?12345454547777"></script>
	<script src="${s.base}/mobile/newjs/window_port.js"></script>
	<!--js分享代码开始-->

	<input type="hidden" value="${jSTicketShareResponse.appid}" id="appid" />
	<input type="hidden" value="${jSTicketShareResponse.fxTitle}" id="fxTitle" />
	<input type="hidden" value="${jSTicketShareResponse.fxImgUrl}" id="fxImgUrl" />
	<input type="hidden" value="${jSTicketShareResponse.fxDesc}" id="fxDesc" />
	<input type="hidden" value="${jSTicketShareResponse.fxUrl}" id="fxUrl" />
	<input type="hidden" value="${jSTicketShareResponse.nonceStr}" id="nonceStr" />
	<input type="hidden" value="${jSTicketShareResponse.timestamp}" id="timestamp" />
	<input type="hidden" value="${jSTicketShareResponse.signature}" id="signature" />
	<script src="${s.base}/mobile/js/share.js"></script>

	<script src="${s.base}/mobile/js/DateSelector/DateSelector.js"></script>
	<script type="text/javascript">
		var memberId = '${memberId}';
        new DateSelector({
            input: 'buyTime',//点击触发插件的input框的id
            container: 'targetContainers',//插件插入的容器id
            type: 0,
            param: [0, 0, 0, 1, 1],
            beginTime: [10, 0],
            endTime: [17, 59],
            recentTime: [11, 0],
            success: function (arr, arr2) {
                $("#buyTime").val(arr2[0]+"时"+arr2[1]+"分")
            }//回调
        });

        var num=1;
        $("#buyDate").calendar({
            value:['${startDate}'],
            minDate: ['${minDate}'],
            dateFormat: 'yyyy-mm-dd',  // 自定义格式的时候，不能通过 input 的value属性赋值 '2016年12月12日' 来定义初始值，这样会导致无法解析初始值而报错。只能通过js中设置 value 的形式来赋值，并且需要按标准形式赋值（yyyy-mm-dd 或者时间戳)
            onChange: function (p, values, displayValues) {
                var day = new Date(Date.parse(values[0].replace(/-/g, "/")));
               	num=day.getDay();
            },
            onClose: function (p) {
                if(num==0){
                    $.toast("节假日及周日不接受预约","text");
                    $("#buyDate").val("");
                    return false;
                }
            }
        });
        // 客户类型
        $('input:radio[name="type"]').click(function(){
            var checkValue = $('input:radio[name="type"]:checked').val();
            if(checkValue=='1'){
                $(".xyg-class-select").show();
                $(".xyg-class-select-o").hide();
            }else{
                $(".xyg-class-select").hide();
                $(".xyg-class-select-o").show();
            }
        });


        // 性别
        $("#selectSex").select({
            title: "请选择性别",
            items: [{title:'男',value:'1'}, {title:'女',value:'2'}],
            onClose: function(d) {
                $("#sex").val(d.data.values);
            },
            onOpen: function() {
            },
        });
        // 针数选择
        $("#pinNum").select({
            title: "请选择针数",
            items: [{title:'第二针',value:'第二针'}, {title:'第三针',value:'第三针'},{title:'第四针（不适用于HPV疫苗）',value:'第四针（不适用于HPV疫苗）'}],
        });
        // 服务
        $("#colId").select({
            title: "请选择服务",
           /* items: [{title:'G9疫苗(3针)',value:'7800'}, {title:'G9疫苗单针',value:'3000'}, {title:'P13',value:'1400'}
                , {title:'HepB',value:'550'}, {title:'日本脑炎(乙脑)',value:'1800'}, {title:'水痘疫苗',value:'800'}
                , {title:'ACWY',value:'1250'}, {title:'MMRV',value:'1200'}, {title:'MMR',value:'900'}
                , {title:'HepA',value:'800'}, {title:'RotaTe',value:'750'}, {title:'Zostavax',value:'1600'}
                ,{title:'Fu',value:'650'}, {title:'5n1',value:'1100'}, {title:'6n1',value:'1200'}, {title:'诊费',value:'300'}],*/
            items:${itemSelectStr},
           onClose: function(d) {
                $("#colId").val(d.data.titles);
                $("#adviseMoney").val(d.data.values);
            },
            onOpen: function() {
            },
        });
        $("#showTooltips").on("click", function () {
            var id = $("#id").val();
            var type = $('input:radio[name="type"]:checked').val();
            //1、新客户，2、老客户
            var num ="";
            if(type=="2"){
                num = $("#num").val();
                if (num == null || num == "") {
                    $.toast("请输入客户编号", "text");
                    return false;
                }
            }
            var colId = $("#colId").val();
            if (colId == null || colId == "") {
                $.toast("请选择服务", "text");
                return false;
            }
            var sysUserNo = $("#sysUserNo").val();

            var pinNum ="";
            if(type=="2"){
                pinNum = $("#pinNum").val();
                if (pinNum == null || pinNum == "") {
                    $.toast("请输入针数", "text");
                    return false;
                }
            }
            var name = $("#name").val();
            if (name == null || name == "") {
                $.toast("请输入姓名", "text");
                return false;
            }
            var sex ="";
            if(type=="1"){
                sex = $('input:radio[name="sex"]:checked').val();
                if (sex == null || sex == "") {
                    $.toast("请选择性别", "text");
                    return false;
                }
            }
            var cardNo =""
            if(type=="1"){
                cardNo = $("#cardNo").val();
                if (cardNo == null || cardNo == "") {
                    $.toast("请输入身份证号", "text");
                    return false;
                }
            }
            var phone = $("#phone").val();
            if (phone == null || phone == "") {
                $.toast("请输入联系电话", "text");
                return false;
            }
            if (!(/^1(3|4|5|6|7|8|9)\d{9}$/.test(phone))) {
                $.toast("联系电话有误，请重填", "text");
                return false;
            }
            var buyDate = $("#buyDate").val();
            if (buyDate == null || buyDate == "") {
                $.toast("请输入日期", "text");
                return false;
            }
            var buyTime = $("#buyTime").val();
            if (buyTime == null || buyTime == "") {
                $.toast("请输入时间", "text");
                return false;
            }
            var adviseMoney =""
            if(type=="1"){
                adviseMoney = $("#adviseMoney").val();
                if (adviseMoney == null || adviseMoney == "") {
                    $.toast("请选择服务", "text");
                    return false;
                }
            }
            var money =""
            if(type=="1"){
                money = $("#money").val();
                if (money == null || money == "") {
                    $.toast("请输入实际价格", "text");
                    return false;
                }
            }
			//预约类型：1、成⼈/⼉童疫苗，2、基因/体检，3、医学美容，4、特效药品咨询
			var subType="1";
            var param = {
                id: id,
                memberId: memberId,
                subType: subType,
                sysUserNo:sysUserNo,
                type: type,
                num: num,
                name:name,
                colId: colId,
                pinNum:pinNum,
                sex:sex,
                cardNo: cardNo,
                phone: phone,
                buyDate: buyDate,
                buyTime: buyTime,
                money: money,
                adviseMoney: adviseMoney
            };
            $.showLoading("正在提交中");
            $.post("/phone/webSubSave", param, function (result) {
                if(1==result.returnInfo.state){
                    $.hideLoading();
                    $.alert("预约提交成功，等待审核！", function() {
                        //点击确认后的回调函数
                        myHome(memberId);
                    });

                }else{
                    $.hideLoading();
                    $.toast("预约失败", "text");
                }

            }, "json");


        });
	</script>
</html>
